class NameForm extends React.Component {
    constructor(props) {
    super(props);
    this.state = {value: 'banana'};  // 默认选中的是苹果   

    this.handleChange = this.handleChange.bind(this);
    this.handleSubmit = this.handleSubmit.bind(this);
  }
    handleChange(event){
        this.setState(
            { value:event.target.value }
        )
    }
    handleSubmit(event){
        alert('你最喜欢的水果是: ' + this.state.value);
        event.preventDefault();
    }

    render(){
        return(
            <form onSubmit = { this.handleSubmit }>
                <label>
                    选择你喜欢的水果：
                    <select value={ this.state.value } onChange={ this.handleChange }>
                        <option value='apple'>苹果</option>
                        <option value='banana'>香蕉</option>
                        <option value='watermelon'>西瓜</option>
                    </select>
                </label>
                <input type='submit' value='提交'/>
            </form>
        )
    }
}

ReactDOM.render(
    <NameForm></NameForm>,
    document.getElementById('root')
)
